<template>
  <div class="page test">
    <img
      class="arrowDown"
      @click="check"
      src="../assets/img/arrowDown.png"
      alt=""
    >
  </div>
</template>

<script>
export default {
  name: 'test',
  data () {
    return {
    }
  },
  mounted () {
  },
  created () {
  },
  computed: {
  },
  methods: {
    check () {
      console.log(111)
    }
  },
  components: {
  }
}
</script>

<style lang="less" scoped>
.test {
  background-color: #000000;
}
.arrowDown {
  width: 5%;
  animation: arrowDown 1s linear infinite;
}
@keyframes arrowDown {
  0% {
    transform: translate3d(0, 0, 0);
  }
  50% {
    transform: translate3d(0, -30px, 0);
  }
  100% {
    transform: translate3d(0, 0, 0);
  }
}
</style>